﻿@using System.Globalization
@model IEnumerable<CultuRAM.Models.Event>

@{
    ViewBag.Title = "CultuRAM: Início";

    Layout = null;
    var u = ViewBag.UserName;
}
<!DOCTYPE html>

<html>
    
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>CultuRAM: Início</title>     
        @Styles.Render("~/Content/backoffice")
        @Styles.Render("~/Content/bootstrap2")
        @Styles.Render("~/Content/fonts")
    </head>
    <body style="margin: 0 10px 0 10px">
        
        <div id="main" style="background-color: white;">
            <div id="menu">
                @Html.Partial("_MenuHome")
                 
            </div>               
            <div id="content" style="background-color: white; min-height: 530px">
                <div class="row-fluid">
                    <div class="span6" style="width: 40%">
                        <h4>Eventos em Destaque</h4>
                        <!-- ----- HIGHLIGHTS ----- -->
                        <div id="highlights" style="width: 500px;">
                            <div id="myCarousel" class="carousel slide">
                                <ol class="carousel-indicators">
                                    @{
                                        var j = 0;
                                        foreach (var item in Model)
                                        {
                                            var itemCl = j == 0 ? "active" : "";
                                            <li data-target="#myCarousel" data-slide-to="@j" class="@itemCl"></li>
                                            j++;
                                        }
                                    }
                                </ol>
                                <!-- Carousel items -->
                                <div class="carousel-inner" style="background: gainsboro;  width: 100%; height: 300px;  overflow: hidden;">                               
                                    @{
                                        var i = 0;
                                        foreach (var item in Model)
                                        {
                                            var itemClass = i++ == 0 ? "item active" : "item";
                                            <div class="@itemClass">
                                                <img alt="" src="@item.Poster" style="width: 100%;"/>
                                                <div class="carousel-caption" style="height: 80px; position: absolute; top: 220px;">
                                                    <h4>@item.Title</h4>
                                                    <p>@item.StartDate.Day.ToString(CultureInfo.CurrentCulture).PadLeft(2, '0') @item.StartDate.ToString("MMMM", CultureInfo.CurrentCulture).ToUpper() | @item.StartDate.ToString("dddd", CultureInfo.CurrentCulture).ToUpper() @{if (@item.StartDate.Hour != 0)
                                                                                                                                                                                                                                                                                      { <span>|</span> @item.StartDate.ToString("HH:mm", CultureInfo.CurrentCulture) }} </p>
                                                    
                                                </div>
                                            </div>
                                        }
                                    }
                                </div>
                                <!-- Carousel nav -->
                                <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
                                <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
                            </div>
                        </div>
                    </div>
                
                    <!-- ----- NEXT EVENTS ----- -->    
                    <div class="span6" style="width: 57%">    
                        <div id="nextEvents" >
                            <h4>Próximos Eventos</h4>
                            <div class="NextEventsList">
                                <div id="">
                                    <table id="tabNextEvents" class="table table-hover">
                                 
                                        @{
                                            foreach (var item in Model)
                                            {
                                                <tr id="@item.EventId" class="eventLine">
                                                    <td>
                                                        <div>
                                                            <div class="iconDateMounth">@item.StartDate.ToString("MMM", CultureInfo.CurrentCulture).ToUpper()</div>
                                                            <div class="iconDateDay"> @item.StartDate.Day.ToString().PadLeft(2, '0')</div>
                                                            <div class="iconDateDayWeek"> @item.StartDate.ToString("ddd", CultureInfo.CurrentCulture).ToUpper() </div>
                                                        </div>
                                                    </td>
                                                    <td style="width: 5%"><img alt="" src="@item.Poster" style="width: 48px"/></td>       
                                                    <td style="width: 90%">
                                                        <span style="color: brown">@item.EventType.Type</span><br />
                                                        <b>@item.Title</b><br />
                                                        @item.Entity.Name
                                                    </td>
                                                </tr>                       
                                            }
                                        }           
                                    </table>
                                </div>
                            </div>
                        </div>  
                    </div>
                </div>
                <div id="accRequest" style="text-align: center; margin-top: 30px;">
                    <div class="alert alert-info" style=" margin-bottom: 30px;">
                        <h4>É um Promotor Cultural? Então associe-se e divulgue gratuitamente os seus eventos através desta Agenda!</h4>
                    </div>
                    <a href="@Url.Action("AccRequest","Home")" class="btn btn-success btn-large" style="width: 330px;"><i class="icon-list-alt icon-white"></i> Efetuar Pedido de Adesão</a>&nbsp;&nbsp;
                    <a href="@Url.Action("AccStatus","Home")" class="btn btn-info btn-large" style="width: 330px;"><i class="icon-search icon-white"></i> Verificar o estado do Pedido de Adesão</a>
                    
                </div>       
            </div>
        </div>

        <footer>
             @Html.Partial("_Footer") 
        </footer>

  
        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/jqueryui")
        @Scripts.Render("~/bundles/jqueryval")
        @Scripts.Render("~/bundles/bootstrap")
        @*@Scripts.Render("~/bundles/bootstrap3") *@
        @Scripts.Render("~/bundles/culturam")
        @Scripts.Render("~/bundles/bootbox")
        @Scripts.Render("~/bundles/bootstrap2")
    </body>
</html>


<!-- Event Modal -->
<div id="eventModal" class="modal hide fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="width: 50%;">
    @*@Html.Partial("~/Views/Event/_HomeView.cshtml", Model.FirstOrDefault())*@  
</div>



<script type="text/javascript">
     
    $('.eventLine').on('click', function (e) {
        
        $("#tabNextEvents tbody").on("click", "tr", function () {
            var idEvent = $(this).attr("id");
            //alert("ID EVENT: " + idEvent);
            OpenModal(idEvent);
        });
       
        $('#eventModal').modal('show');        
    });

    function OpenModal(idEvent) {
        $.ajax({
            url: '/Event/HomeView',
            dataType: 'html',
            type: 'GET',
            data: { id: idEvent },
            success: function (data) {
                $('#eventModal').html(data);
                //jQuery.validator.unobtrusive.parse('#eventModal');           
            },
            error: function () {
                alert("ERRO: ao tentar carregar os dados do Evento!");
                ParamBgColorClear();
            }
        });
    }


    var $ = jQuery.noConflict();
    $('#myCarousel').carousel({ interval: 2000, cycle: true });
    
</script>